| KindEditor 4.x Documentation | 您所在的位置：网站首页 › kindeditor编辑器的工具栏简介 › KindEditor 4.x Documentation |
|
编辑器(Editor) API¶
Contents 编辑器(Editor) API K.create(expr [, options]) K.remove(expr) K.sync(expr) K.html(expr, val) K.appendHtml(expr, val) K.insertHtml(expr, val) remove() html() html(val) fullHtml() text() text(val) selectedHtml() count([mode]) isEmpty() insertHtml(val) appendHtml(val) focus() blur() sync() exec(commandName) lang(name) loadPlugin(name , fn) clickToolbar(name) clickToolbar(name [, fn]) addBookmark() undo() redo() fullscreen([bool]) readonly(isReadonly) createMenu(options) hideMenu() addContextmenu(item) hideContextmenu() createDialog(options) hideDialog() K.create(expr [, options])¶创建编辑器，返回第一个KEditor对象。4.1版本开始expr支持多个textarea，之前版本只在第一个textarea上创建。 创建编辑器后可以用 KindEditor.instances 数组取得已创建的所有KEditor对象。 参数: mixed expr: element或选择器 object options: 编辑器初始化参数返回: KEditor 示例: // 1 // editor 等于 KindEditor.instances[0] editor = K.create('textarea[name="content"]'); editor.html('HTML code'); // 2 editor = K.create('#editor_id', { filterMode : true, langType : 'en' });Note 4.1.2版本开始expr可以直接传入jQuery对象。 K.remove(expr)¶移除多个编辑器。 参数: mixed expr: element或选择器返回: undefined 示例: // 移除ID为editor_id的编辑器 K.remove('#editor_id'); // 移除class为editor-class的编辑器 K.remove('.editor-class');Note 4.1.2版本开始支持。 K.sync(expr)¶将多个编辑器的内容设置到原来的textarea控件里。。 参数: mixed expr: element或选择器返回: undefined 示例: // 同步ID为editor_id的编辑器 K.sync('#editor_id'); // 同步class为editor的编辑器 K.sync('.editor');Note 4.1.2版本开始支持。 K.html(expr, val)¶设置多个编辑器的HTML内容。 参数: mixed expr: element或选择器 string val: HTML内容返回: undefined 示例: K.html('#editor_id', 'HTML');Note 4.1.8版本开始支持。 K.appendHtml(expr, val)¶将指定的HTML内容添加到多个编辑器的最后位置。 参数: mixed expr: element或选择器 string val: 内容返回: undefined 示例: K.appendHtml('#editor_id', 'HTML');Note 4.1.8版本开始支持。 K.insertHtml(expr, val)¶将指定的HTML内容插入到多个编辑器的光标处。 参数: mixed expr: element或选择器 string val: 内容返回: undefined 示例: K.insertHtml('#editor_id', 'HTML');Note 4.1.8版本开始支持。 remove()¶移除编辑器。 参数: 无 返回: KEditor示例: editor.remove(); html()¶取得编辑器的HTML内容。 参数: 无 返回: string示例: var html = editor.html(); html(val)¶设置编辑器的HTML内容。 参数: string val: HTML返回: KEditor 示例: editor.html('HTML code'); fullHtml()¶取得完整的HTML内容，HTML包含标签。 参数: 无 返回: string示例: var fullHtml = editor.fullHtml(); text()¶取得编辑器的纯文本内容。(包含img和embed) 参数: 无 返回: string示例: var text = editor.text(); text(val)¶设置编辑器的内容，直接显示HTML代码。 参数: string val: 文本返回: KEditor 示例: editor.text('HTML code'); selectedHtml()¶取得当前被选中的HTML内容。 参数: 无 返回: string示例: var html = editor.selectedHtml(); count([mode])¶取得当前被选中的HTML内容。 参数: string mode: 可选参数，默认值为”html”，mode为”html”时取得字数包含HTML代码，mode为”text”时只包含纯文本、IMG、EMBED。返回: Int 示例: htmlCount = editor.count(); textCount = editor.count('text'); isEmpty()¶判断编辑器是否有可见内容，比如文本、图片、视频。 参数: 无 返回: Boolean示例: if (editor.isEmpty()) { alert('请输入内容。'); } insertHtml(val)¶将指定的HTML内容插入到编辑区域里的光标处。 参数: string val: HTML返回: KEditor 示例: editor.insertHtml('HTML code'); appendHtml(val)¶将指定的HTML内容添加到编辑区域的最后位置。 参数: string val: HTML返回: KEditor 示例: editor.appendHtml('HTML code'); focus()¶编辑器聚焦。 参数: 无 返回: KEditor示例: editor.focus(); blur()¶编辑器失去焦点。 参数: 无 返回: KEditor示例: editor.blur(); sync()¶将编辑器的内容设置到原来的textarea控件里。 参数: 无 返回: KEditor示例: editor.sync(); exec(commandName)¶执行编辑命令，替代document.execCommmand接口。 参数: string commandName: 命令名返回: KEditor 目前可用的命令: commandName 描述 示例 bold 粗体 editor.exec(‘bold’); italic 斜体 editor.exec(‘italic’); underline 下划线 editor.exec(‘underline’); strikethrough 删除线 editor.exec(‘strikethrough’); forecolor 文字颜色 editor.exec(‘forecolor’, ‘#333’); hilitecolor 文字背景 editor.exec(‘hilitecolor’, ‘#eee’); fontsize 文字大小 editor.exec(‘fontsize’, ‘14px’); fontfamily 字体 editor.exec(‘fontfamily’, ‘SimHei’); fontname 字体，fontfamily的别名 editor.exec(‘fontname’, ‘SimHei’); removeformat 删除inline样式 editor.exec(‘removeformat’); inserthtml 插入HTML editor.exec(‘inserthtml’, ‘HTML’); hr 插入水平线 editor.exec(‘hr’); print 弹出打印窗口 editor.exec(‘print’); insertimage 插入图片 editor.exec(‘insertimage’, ‘1.jpg’, ‘title’, 200, 100, 1, ‘right’); createlink 超级链接 editor.exec(‘createlink’, ‘1.html’, ‘_blank’); unlink 取消超级链接 editor.exec(‘unlink’); formatblock 段落 editor.exec(‘formatblock’, ‘’); selectall 全选 editor.exec(‘selectall’); justifyleft 左对齐 editor.exec(‘justifyleft’); justifycenter 居中 editor.exec(‘justifycenter’); justifyright 右对齐 editor.exec(‘justifyright’); justifyfull 两端对齐 editor.exec(‘justifyfull’); insertorderedlist 编号 editor.exec(‘insertorderedlist’); insertunorderedlist 项目符号 editor.exec(‘insertunorderedlist’); indent 增加缩进 editor.exec(‘indent’); outdent 减少缩进 editor.exec(‘outdent’); subscript 下标 editor.exec(‘subscript’); superscript 上标 editor.exec(‘superscript’); cut 剪切 editor.exec(‘cut’); copy 复制 editor.exec(‘copy’); paste 粘贴 editor.exec(‘paste’); lang(name)¶取得语言。 参数: string name: language key返回: string 示例: str = editor.lang('table'); // return '表格' loadPlugin(name , fn)¶动态加载插件。 参数: string name: 插件名 function fn: 加载成功后执行的回调函数返回: KEditor 示例: editor.loadPlugin('table', function() { alert('加载成功。'); }); clickToolbar(name)¶执行绑定在工具栏上的点击事件函数。 参数: string name: item name返回: KEditor 示例: editor.clickToolbar('bold'); // 对选中文本进行加粗 clickToolbar(name [, fn])¶绑定工具栏的点击事件函数。 参数: string name: item name function fn: 点击工具栏时执行的回调函数。返回: fn的return value 示例: editor.clickToolbar('bold', function() { editor.exec('bold'); }); addBookmark()¶将当前数据添加到undo/redo记录里。 参数: 无 返回: KEditor示例: editor.addBookmark(); undo()¶后退。 参数: 无 返回: KEditor示例: editor.undo(); redo()¶撤销后退。(前进) 参数: 无 返回: KEditor示例: editor.redo(); fullscreen([bool])¶切换全屏模式。 参数: Boolean bool: 默认切换(toggle)全屏模式，false时取消全屏，true时变成全屏。返回: KEditor 示例: editor.fullscreen(); readonly(isReadonly)¶设置成只读状态，或取消只读状态。 参数: Boolean isReadonly: false时取消只读状态，true时设置成只读状态。返回: KEditor 示例: editor.readonly(false); createMenu(options)¶显示下拉菜单。 参数: object options: 初始化参数返回: KMenu ( 下拉菜单(Menu) API ) 示例: var menu = editor.createMenu({ name : 'example1', width : 150 }); menu.addItem({ title : '红色', click : function() { alert('red'); } }); menu.addItem({ title : '白色', click : function() { alert('white'); } }); hideMenu()¶隐藏下拉菜单。 参数: 无 返回: KEditor示例: editor.hideMenu(); addContextmenu(item)¶添加自定义右键菜单。 参数: object item: 请参考 KMenu.addItem(item)的item参数返回: KEditor 示例: editor.addContextmenu({ title : 'test', click : function() { alert('clicked'); }, cond : true, width : 150, }); // 插入分割线 editor.addContextmenu({ title : '-' }); hideContextmenu()¶隐藏自定义右键菜单。 参数: 无 返回: KEditor示例: editor.hideContextmenu(); createDialog(options)¶显示弹出窗口(dialog)。 参数: object options: 初始化参数返回: KDialog ( 弹出窗口(Dialog) API ) 示例: var dialog = editor.createDialog({ name : 'about', width : 300, title : self.lang('about'), body : 'Hello' }); hideDialog()¶隐藏弹出窗口(dialog)。 参数: 无 返回: KMenu示例: editor.hideDialog(); |
| CopyRight 2018-2019 实验室设备网 版权所有 |